<!--供应商详情-->
<template>
  <div class="app-container-add">
    <el-dialog
      v-dialogDrag
      :title="dialogTitle"
      :visible.sync="dialogVisible"
      class="dialogStyleMiddle"
      :before-close="cancel"
    >
      <el-form
        ref="addForm"
        class="dialog-form"
        :model="formData"
        label-width="80px"
      >
        <el-row :gutter="20">
          <el-col :span="12">
            <el-form-item label="企业名称" prop="name">
              <span class="detail-info">{{ formData.name }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label prop="userdName">
              <label slot="label" v-html="`曾&ensp;用&ensp;名`" />
              <span class="detail-info">{{ formData.userdName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="企业类型" prop="sysEnterpriseTypeName">
              <span class="detail-info">{{ formData.sysEnterpriseTypeName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="信用代码" prop="creditCodePic">
              <span class="detail-info">{{ formData.creditCodePic }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="单位法人" prop="legalperson">
              <span class="detail-info">{{ formData.legalperson }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label prop="contacts">
              <label slot="label" v-html="`联&ensp;系&ensp;人`" />
              <span class="detail-info">{{ formData.contacts }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="联系电话" prop="phone">
              <span class="detail-info">{{ formData.phone }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="24">
            <el-form-item label="详细地址" prop="address">
              <span class="detail-info">{{ formData.address }}</span>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-dialog>
  </div>
</template>

<script>
import { detailEnterprise } from '@/api/supplier/enterpriseManage'
export default {
  name: 'DetailDialog',
  props: {
    enterTypeOptions: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      /* 新增 start*/
      dialogTitle: '', // 弹层标题
      dialogVisible: false, // 弹层是否显示
      btnDisabled: false, // 确定按钮
      formData: {
        name: '', // 企业名称
        userdName: '', // 曾用名
        classification: '', // 企业类别
        enterpriseType: '', // 企业类型
        creditCodePic: '', // 企业信用代码
        unitCreditCodePic: [], // 企业信用代码扫描件
        legalperson: '', // 单位法人
        address: '', // 详细地址
        contacts: '', // 联系人
        phone: '' // 联系人电话
      },
      certificateJson: []
    }
  },
  mounted() {},
  methods: {
    /* 详情弹层 start*/
    // 从父组件获取参数的方法
    handleAdd(title, id) {
      this.dialogVisible = true
      this.dialogTitle = title
      this.$nextTick(() => {
        this.getDetailById(id)
      })
    },
    async getDetailById(id) {
      const { data } = await detailEnterprise(id)
      this.formData = { ...data }
      if (data.appFiles) {
        this.certificateJson = data.appFiles
      }
    },
    // 关闭
    cancel() {
      this.dialogVisible = false
    }
    /* 详情弹层 end*/
  }
}
</script>

<style scoped>
</style>
